/*
 * 产品搜索
 * @Author: ljb
 * @Date: 2018-03-27 17:51:07
 * @Last Modified by: ljb
 * @Last Modified time: 2018-10-10 10:31:29
 */
<template>
	<Form
		ref="formInline"
		inline
		@keydown.native.enter.prevent="confirmSearch">

		<Form-item
			:label-width="80"
			:label="$t('common.keyword')"
			prop="keyword">
			<i-input
				v-model="formValidate.keyword"
				:placeholder="$t('product.please_enter_title_key')"
				type="text"/>
		</Form-item>

		<Form-item
			:label-width="80"
			:label="$t('product.category')"
			prop="category_id">
			<Select
				v-model="formValidate.category_id"
				clearable
				style="width:120px">
				<OptionGroup
					v-for="(item,key) in groupCategories"
					:key="key"
					:label="item.custom_type_name">
					<Option
						v-for="(value,key) in item.categories"
						:value="Number(value.id)"
						:key="key">{{ value.name }}</Option>
				</OptionGroup>
			</Select>
		</Form-item>

		<Form-item
			:label-width="80"
			:label="$t('product.brand')"
			porp="brand_id">
			<Select
				v-model="formValidate.brand_id"
				clearable
				style="width:120px">
				<Option
					v-for="( value , key ) in brands"
					:value="key + ''"
					:key="key">{{ value }}</Option>
			</Select>
		</Form-item>

		<!-- <Form-item
			:label-width="80"
			:label="$t('product.is_sale')"
			porp="is_sale">
			<Select
				v-model="formValidate.is_sale"
				clearable>
				<Option
					v-for="status in true_false_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item>

		<Form-item
			:label-width="100"
			:label="$t('product.is_hot')"
			porp="is_hot">
			<Select
				v-model="formValidate.is_hot"
				clearable>
				<Option
					v-for="status in true_false_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item>

		<Form-item
			:label-width="100"
			:label="$t('product.is_new')"
			porp="is_new">
			<Select
				v-model="formValidate.is_new"
				clearable>
				<Option
					v-for="status in true_false_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item> -->

		<!-- <Form-item
			v-if="Number(getUserInfo.has_youzan) === 1"
			:label-width="100"
			:label="$t('product.is_youzan')"
			porp="is_youzan">
			<Select
				v-model="formValidate.has_youzan"
				style="width:120px"
				clearable>
				<Option
					v-for="status in youzan_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item> -->

		<Form-item
			:label-width="80"
			:label="$t('product.is_deleted')"
			porp="is_sale">
			<Select
				v-model="formValidate.is_sale"
				style="width:120px"
				clearable>
				<Option
					v-for="status in true_false_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item>

		<Form-item>
			<Button
				type="primary"
				@click="confirmSearch">
				{{ $t('common.search') }}
			</Button>
		</Form-item>

		<Form-item>
			<Button
				type="primary"
				@click="confirmExcel">
				{{ $t('common.export_excel') }}
			</Button>
		</Form-item>

	</Form>
</template>
<script>

import { mapGetters } from 'vuex';

export default {

	name: 'ProductSearchForm',

	props: {
		brands: {
			type: [Object, Array],
			required: true,
		},
		groupCategories: {
			type: Array,
			default() {
				return [];
			},
		},
	},
	data() {
		return {
			youzan_status: [
				{
					label: this.$t('product.no'), // 否
					value: 'not_youzan',
				},
				{
					label: this.$t('product.yes'), // 是
					value: 'youzan',
				},
			],
			true_false_status: [
				{
					label: this.$t('product.no'), // 否
					value: '0',
				},
				{
					label: this.$t('product.yes'), // 是
					value: '1',
				},
			],
			formValidate: {
				is_sale: '',

				is_deleted: '',

				is_hot: '',

				is_new: '',

				has_youzan: '',

				brand_id: '', // 品牌

				category_id: '', // 类别

				keyword: '',
			}, // 搜索框的对象参数
		};
	},
	computed: {
		...mapGetters('userToken', [
			'getUserInfo',
		]),
	},

	methods: {

		/**
		 * 导出excel表格
		 * @return {undefined}
		 */
		confirmExcel() {
			this.$emit('export', this.formValidate);
		},

		/**
         * 确认搜索
         * @return {undefined}
         */
		confirmSearch() {
			const param = {

				is_sale: this.formValidate.is_sale,

				is_deleted: this.formValidate.is_deleted,

				is_hot: this.formValidate.is_hot,

				is_new: this.formValidate.is_new,

				has_youzan: this.formValidate.has_youzan,

				brand_id: this.formValidate.brand_id,

				category_id: this.formValidate.category_id,

				keyword: this.formValidate.keyword,

			};

			this.$emit('search', param);
		},

	},

};

</script>
